<template>
  <div class="contail">
    <van-nav-bar class="header"
                 title="公告详情"
                 left-arrow
                 @click-left="$router.goBack()">
      <van-icon name="sangedian"
                @click="show=true"
                slot="right"
                style="margin-top:-10px;" />
    </van-nav-bar>
    <div class="weaper">
      <div class="fengniao-content info">
        <h3 class="title"
            v-text="obj.title"></h3>
        <p class="date"
           v-text="obj.createDate"></p>
        <div class="text"
             v-html="content">
        </div>
      </div>
    </div>
    <van-actionsheet v-model="show"
                     :actions="actions"
                     cancel-text="取消" />
  </div>
</template>

<script>

import { getNewsObj } from '@/api/common';
import { wechatSDK } from '@/cordova/';

export default {
  name: 'noticeDetail',
  data() {
    return {
      obj: {

      },
      id: '',
      show: false,
      actions: [
        {
          name: '分享',
          callback: this.wechatShare,
        },
      ],
    };
  },
  computed: {
    content() {
      return this.obj.body.replace(/src="/g, `src="${this.imagesUrl}/`);
    },
  },
  created() {
    this.id = this.$route.query.id;
    this.getNewsObj();
  },
  mounted() { },
  methods: {
    getNewsObj() {
      getNewsObj(this.id).then((res) => {
        const data = res.data;
        this.obj = data;
      });
    },
    wechatShare() {
      wechatSDK()
        .then((res) => {
          this.$toast.loading({
            duration: 0,
            forbidClick: true,
            mask: true,
            loadingType: 'spinner',
            message: '正在调用微信...',
          });
          return res.share({
            title: '开锁分享',
            url: '',
            description: '用于门禁的二维码分享',
          });
        })
        .then(() => {
          this.$message.success({
            message: '分享成功',
            duration: 1500,
          });
        });
    },
  },
};
</script>

<style lang="scss" scoped>
.contail {
  height: 100%;
  .weaper {
    height: 100%;
    .info {
      padding: 10px 20px;
      height: 100%;
      .title {
        margin-bottom: 15px;
        color: #3f4146;
        font-size: 20px;
        line-height: 30px;
      }
      .date {
        margin-bottom: 30px;
        font-size: 14px;
        color: #9b9ea3;
      }
    }
  }
}
</style>

